<template>
  <div class="page-wrap">
    <view class="title-bar" v-if="userInfo.real_name||userInfo.user_disp||userInfo.user_no">
      <text> 你好！{{userInfo.real_name||userInfo.user_disp||userInfo.user_no||''}},欢迎登录 ~</text>
      <button class="cu-btn sm round bg-white" @click="clickMenu({menu_no:'切换账号'})">切换账号 <text
          class="cuIcon-right"></text></button>
    </view>
    <view class="page-content">
      <view class="swiper-img-box">
        <swiper class="swiper" :indicator-dots="true" :autoplay="true" :interval="2000" :duration="500">
          <swiper-item v-for="item in swiperList">
            <image class="swiper-img" :src="item" mode="aspectFill"></image>
            <!-- <view class="swiper-item uni-bg-blue">C</view> -->
          </swiper-item>
        </swiper>
        <!-- <image class="swiper-img" src="./swiper1.png" mode="aspectFill" v-f></image> -->
      </view>
      <view class="menu-group">
        <view class="menu-item" v-for="item in menuList" @click="clickMenu(item)">
          <view class="menu-icon">
            <view class="cu-tag badge" v-if="item.wait_tip_service">
              {{item.wait_tip_service||''}}
            </view>
            <image :src="getImagePath(item.app_icon,true)" mode="aspectFit" class="menu-icon" v-if="item.app_icon">
            </image>
            <image :src="item.icon" mode="aspectFit" class="menu-icon" v-else></image>
          </view>
          <view class="menu-name">
            {{item.name||''}}
          </view>
        </view>
      </view>
      <view class="sub-title">
        <image :src="require('./icon/notice.png')" class="title-icon" mode="aspectFill"></image>
        <!-- <text class="cuIcon-titles"></text> -->
        <text> 海外事业部通知</text>
      </view>
      <view class="notice-list">
        <view class="notice-item" v-for="item in noticeList" @click="showNotice(item.notice_content)">
          <view class="notice-content">
            <text class="cuIcon-messagefill margin-right-xs text-yellow"></text>
            <text class="text-bold">{{item.notice_title||''}}</text>
          </view>
          <view class="create-time">{{item.create_time}}</view>
        </view>
      </view>
    </view>
  </div>
</template>

<script>
  function html2text(value) {
    return value
      .replace(/<(style|script|iframe)[^>]*?>[\s\S]+?<\/\1\s*>/gi, '')
      .replace(/<[^>]+?>/g, '')
      .replace(/\s+/g, ' ')
      .replace(/ /g, ' ')
      .replace(/&nbsp;/g, ' ')
      .replace(/>/g, ' ');
  }

  var menuList = [{
      name: '项目数据库',
      menu_no: 'srvmarket_project_info_view_select',
      icon: require('@/static/img/icon/组 2847.png')
    },
    {
      name: '立项审批',
      menu_no: 'srvmarket_project_apply_select',
      icon: require('@/static/img/icon/组 2845.png')
    },
    {
      name: '投标审批',
      menu_no: 'srvmarket_bidding_plan_info_select',
      icon: require('@/static/img/icon/组 2846.png')
    },
    {
      name: '标前一级',
      menu_no: 'srvmarket_pre_overview_select',
      icon: require('@/static/img/icon/组 2848.png')
    },
    {
      name: '合规审批',
      menu_no: 'market_capital_audit',
      icon: require('@/static/img/icon/组 2854.png')
    },
    {
      name: '标前二级',
      menu_no: 'srvmarket_pre_overview_two',
      icon: require('@/static/img/icon/组 2856.png')
    },
    {
      name: '结论评审',
      menu_no: 'conclusion_review',
      icon: require('@/static/img/icon/组 2855.png')
    },
    {
      name: '终止审批',
      menu_no: 'project_terminated_apply',
      icon: require('@/static/img/icon/中止审批.png')
    },
    // {
    //   name: '切换账号',
    //   icon: require('@/static/img/icon/switch_user.png')
    // }
  ]
  import {
    getNotice,
    getMenu,
    getSwiper
  } from '@/common/api/index.js'
  export default {
    computed: {
      userInfo() {
        return uni.getStorageSync('login_user_info') || {}
      }
    },
    data() {
      return {
        noticeList: [],
        swiperList: [],
        noticePageNo: 1,
        menuList: []
      }
    },
    methods: {
      clickMenu(e) {
        let url = null
        let serviceName = ''
        let viewTemp = '{"title":"project_name_cn","tip":"current_child_node","footer":"current_node"}'
        debugger
        // switch (e.name) {
        //   case '项目数据库':
        //     url =
        //       '/pages/public/list/list?serviceName=srvmarket_project_info_view_select&pageType=list&viewTemp={"title":"project_name_cn","tip":"current_child_node","footer":"current_node"}&destApp=market&disabled=true'
        //     break;
        //   case "立项审批":
        //     serviceName = 'srvmarket_project_apply_select'
        //     break
        //   case "投标审批":
        //     serviceName = 'srvmarket_bidding_plan_info_select'
        //     break
        //   case "标前一级":
        //     serviceName = 'srvmarket_pre_evaluation_one_select'
        //     break
        //   case "标前二级":
        //     serviceName = 'srvmarket_pre_evaluation_two_select'
        //     break
        //   case "合规审批":
        //     serviceName = 'srvmarket_capital_audit_select'
        //     break
        //   case "结论审批":
        //   case "结论评审":
        //     serviceName = 'srvmarket_conclusion_review_select'
        //     break
        //   case '切换账号':
        //     url = '/pages/public/accountExec/accountExec'
        //     break
        // }
        switch (e.menu_no) {
          case 'srvmarket_project_info_view_select':
            url =
              '/pages/public/list/list?serviceName=srvmarket_project_info_view_select&pageType=list&viewTemp={"title":"project_name_cn","tip":"current_child_node","footer":"current_node"}&destApp=market&disabled=true'
            break;
            // case "srvmarket_project_apply_select":
            //   serviceName = 'srvmarket_project_apply_select'
            //   break
            // case "srvmarket_bidding_plan_info_select":
            //   serviceName = 'srvmarket_bidding_plan_info_select'
            //   break
            // case "srvmarket_pre_overview_select":
            //   serviceName = 'srvmarket_pre_evaluation_one_select'
            //   break
            // case "srvmarket_pre_overview_two":
            //   serviceName = 'srvmarket_pre_evaluation_two_select'
            //   break
            // case "market_capital_audit":
            //   serviceName = 'srvmarket_capital_audit_select'
            //   break
            // case "conclusion_review":
            //   serviceName = 'srvmarket_conclusion_review_select'
            //   break
          case '切换账号':
            url = '/pages/public/accountExec/accountExec'
            break
          default:
            serviceName = e.service_name
            break
        }
        if (!url) {
          url = `/pages/public/proc/procList/procList?serviceName=${serviceName}&viewTemp=${viewTemp}`
        }
        if (url) {
          if (url === '/pages/public/accountExec/accountExec') {
            uni.showModal({
              title: '提示',
              content: '是否退出登录并跳转到登录页面?',
              success: (res) => {
                if (res.confirm) {
                  uni.clearStorageSync()
                  uni.reLaunch({
                    url: url
                  })
                }
              }
            })
            return
          }
          uni.navigateTo({
            url,
            fail(e) {
              console.log(e)
            }
          })
        }
      },
      showNotice(e) {
        e = html2text(e)
        if (e) {
          uni.showModal({
            // title:'通知',
            content: e,
            showCancel: false
          })
        }
      },
      onRefresh() {
        getSwiper().then(res => {
          if (Array.isArray(res.data)) {
            this.swiperList = res.data.map(item => {
              if (item.picture) {
                item.pictureUrl = this.getImagePath(item.picture, true)
              }
              return item.pictureUrl
            })
          }
        })
        getNotice(this.noticePageNo).then(res => {
          if (res && res.data) {
            this.noticeList = res.data;
          }
        })
        this.setMenu()
      },
      setMenu() {
        getMenu().then(res => {
          if (Array.isArray(res?.data)) {
            let menu_list = res.data
            this.menuList = menuList.filter(item => {
              let r_menu = menu_list.find(e => e.menu_name && e.menu_name === item.name)
              if (r_menu && r_menu.menu_no) {
                item.service_name = r_menu.service_name
                item.wait_tip_service = r_menu.wait_tip_service
              }

              return r_menu && r_menu.menu_no
              // || ['结论审批', '切换账号'].includes(item.name)
            })
          }
        })
      },
    },
    onShow() {
      this.setMenu()
    },
    onPullDownRefresh() {
      this.onRefresh()
      setTimeout(_ => {
        uni.stopPullDownRefresh()
      }, 500)
    },
    created() {
      getSwiper().then(res => {
        if (Array.isArray(res.data)) {
          this.swiperList = res.data.map(item => {
            if (item.picture) {
              item.pictureUrl = this.getImagePath(item.picture, true)
            }
            return item.pictureUrl
          })
        }
      })
      // this.setMenu()
      getNotice(this.noticePageNo).then(res => {
        if (res && res.data) {
          this.noticeList = res.data;
        }
      })
    }
  }
</script>

<style scoped lang="scss">
  .page-wrap {
    background-color: #F8F8FA;
    min-height: calc(100vh - var(--window-top));

    .title-bar {
      background-color: #fff;
      padding: 10px;
      margin-bottom: 10px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      color: #333;
    }

    .page-content {
      padding: 0 10px;
    }

    .sub-title {
      padding: 5px;
      background-color: #fff;
      font-weight: bold;
      border-radius: 10px 10px 0 0;
      display: flex;
      align-items: center;
      font-size: 16px;
      border-bottom: 1px solid #f1f1f1;

      .title-icon {
        width: 30px;
        height: 30px;
        margin-right: 5px;
      }
    }

    .swiper-img-box {
      width: 100%;
      height: 150px;
      background-color: #F1F1F1;
      margin-bottom: 10px;
      border-radius: 5px;

      .swiper-img {
        border-radius: 5px;
        width: 100%;
        height: 100%;
      }
    }

    .menu-group {
      background-color: #fff;
      border-radius: 5px;
      padding: 10px;
      margin-bottom: 10px;
      display: flex;
      flex-wrap: wrap;

      .menu-item {
        width: 25%;
        text-align: center;
        display: flex;
        align-items: center;
        flex-direction: column;
        margin-bottom: 10px;
        position: relative;

        .menu-icon {
          width: 40px;
          height: 40px;
          line-height: 40px;
          font-size: 30px;
          background: #f1f1f1;
          border-radius: 10px;
          margin-bottom: 5px;
          position: relative;

          .cu-tag {
            z-index: 1;
          }
        }

        .menu-name {
          text-align: center;
        }
      }
    }

    .notice-list {
      background-color: #fff;
      border-radius: 0 0 5px 5px;
      padding: 10px;

      .notice-item {
        margin-bottom: 10px;
        border-bottom: 1px solid #f1f1f1;
        padding-bottom: 5px;

        &:last-child {
          border-bottom: none;
          margin-bottom: 0px;
        }

        .notice-content {
          width: 100%;
        }

        .create-time {
          margin-top: 5px;
          width: 100%;
          // text-align: right;
          color: #999;
        }
      }
    }
  }
</style>
